<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="content-type" content="text/html;charset=utf-8" />
		<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
		<title>查看</title>
		<link rel="stylesheet" href="../../../css/reset.css"/>
		<link rel="stylesheet" href="../../../css/seedoctors.css"/>
		<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
		<script type="text/javascript" src="../../../js/global/jquery-1.7.2.min.js"></script>
		<script type="text/javascript">
			$(document).ready(function(){
				// 地图和搜索结果框高度设置
				var mapheight = $(window).height();
				$('#mappanel').height(mapheight - 100 -32);
				$('#resultpanel').height(mapheight - 100 - 32);
				// 点击隐藏面板后地图和搜索结果框的设置
				$('#hideresult').click(function(){
					var pow = $('#map').css('marginRight');
					var parm = Math.pow(0,parseInt(pow));
					$('#map').css({marginRight : 320*parm });
					$('#results').toggle();
					$(this).css({right : 320*parm-parm });
				});
				// 改变浏览器窗口大小后对各面板大小的更改
				$(window).resize(function(){
					mapheight = $(window).height();
					$('#mappanel').height(mapheight - 100 -32);
					$('#resultpanel').height(mapheight - 100 - 32);
				});
				// 百度地图调用代码
				var map = new BMap.Map("mappanel");				// 创建Map实例
				var point = new BMap.Point(116.404, 39.915);    // 创建点坐标
				var opt = {anchor: BMAP_ANCHOR_TOP_LEFT, offset: new BMap.Size(20, 50)};	// 设置控件位置
				map.addControl(new BMap.NavigationControl(opt));// 添加平移缩放控件
				map.addControl(new BMap.ScaleControl());		// 添加比例尺控件
				map.addControl(new BMap.OverviewMapControl());	// 添加缩略地图控件
				map.enableScrollWheelZoom();					// 启用滚轮放大缩小
				map.centerAndZoom(point,12);					// 初始化地图,设置中心点坐标和地图级别
				var local = new BMap.LocalSearch(map, {			// 用于搜索
					renderOptions: {map: map, panel: "resultpanel"}
				});
				var geolocation = new BMap.Geolocation();		// 浏览器定位，可定到点，但是不知道根据什么来的，
				geolocation.getCurrentPosition(function(r){		// 不是很准,且多数浏览器自动阻止获取位置，
				    if(this.getStatus() == BMAP_STATUS_SUCCESS){// 少数有提示
				        var mk = new BMap.Marker(r.point);		// 还有一种根据IP定位，最多定到市，比较准确，应该比较适合
				       	map.addOverlay(mk);
				        map.panTo(r.point);
				    }
				    else {
				        alert('Failed'+this.getStatus());
				    }
				})
				// 搜索
				$('#start').click(function startsearch() {
					var key = document.getElementById('searchkey').value;
					local.search(key);
				});
			});
		</script>
</head>
	<body>
		<div class="header">
			<div class="headerwrap clearfix">
				<h1><a href="#">Yibao</a></h1>
				<ul class="topnav clearfix">
					<li><a href="../../../index.html">首页</a></li>
					<li><a href="#">个人主页</a></li>
					<li><a href="#">问答</a></li>
					<li><a href="#">学术中心</a></li>
					<li><a href="#">看病咨询</a></li>
				</ul>
				<div class="search clearfix">
					<input type="text" id="searchkey"/><input type="button" value="搜索" id="start"/>
				</div>
				<ul class="topfun">
					<li><a href="#" class="message">消息</a></li>
					<li class="user">
						<a href="#" id="loginuser">成家梓</a>
						<ul class="subfun">
							<li><a href="#">我乱写的</a></li>
							<li><a href="#">OoxX</a></li>
							<li><a href="#">退出</a></li>
						</ul>
					</li>
				</ul>
			</div>
		</div>
		<div class="wrap">
			<div class="map" id="map">
				<div class="title">
					<h2>医生搜寻</h2>
				</div>
				<div class="shadow"></div>
				<div id="mappanel"></div>
			</div>
			<div class="result" id="results">
				<div class="title">
					<h2 style="border-left:1px solid #dddddd;">结果面板</h2>
				</div>
				<div id="resultpanel" class="results"></div>
			</div>
			<a href="javascript:void(0)" id="hideresult" class="noresult"><b class="b1"></b><b class="b2"></b></a>
		</div>
	</body>
</html>